define(["calPosition"],function(calPagePosition){
	return function draggable(ele , opt,callBack){
			//首先需要判断该元素是否有定位，static不能拖拽
			if(getComputedStyle(ele).position == "static") { //js无法直接获取非行内的样式
				throw new Error("该元素没有定位，所以不能拖拽");
			}
		
			var options = {
				x:true,
				y:false,
			}
			
			//1.获取鼠标在页面的位置  - 鼠标在元素上的位置 - 父级元素的位置
			//2.计算鼠标在元素内部的位置，减去在元素内部的位置，是为了让鼠标始终保持在元素固定位置
			//3.获取父级元素的位置坐标，是为了让元素跟随鼠标，
			
			//当鼠标按下，获取鼠标在元素内部的位置
			function mouseDown(e){
				ele._offsetX = e.offsetX;
				ele._offsetY = e.offsetY;
				
				document.addEventListener("mousemove",mouseMove); //当鼠标按下的时候，记录位置，并调用move、函数
				
			}
			
			//获取父级元素的位置
			var _parentOffsetX = calPagePosition(ele.parentNode).x;
			var _parentOffsetY = calPagePosition(ele.parentNode).y;
			
			function mouseUp(e){ //鼠标抬起的时候，把移动的函数清空
				document.removeEventListener("mousemove",mouseMove);
			}
			
			function mouseMove(e){ //鼠标移动需要改变滑块的位置
				
					if(opt.x && opt.y){
						ele.style.left = e.pageX - ele._offsetX - _parentOffsetX + "px";
						ele.style.top = e.pageY - ele._offsetY - _parentOffsetY + "px";
					}else if(opt.y){
						ele.style.top = e.pageY - ele._offsetY - _parentOffsetY + "px";
					}
					else{
						ele.style.left = e.pageX - ele._offsetX - _parentOffsetX + "px";
					}
				
			}
			
			ele.addEventListener("mousedown",mouseDown); //调用鼠标按下的函数
			document.addEventListener("mouseup",mouseUp); //document监听鼠标抬起
		}
	
})